<script setup>
import Sidebar from '@/components/Sidebar.vue'
import { onMounted } from 'vue';
import { useStore } from 'vuex'

const store = useStore()

onMounted(() => {
    store.dispatch('getTableData')
})
</script>

<template>
    <div class="common-layout">
        <el-container>
            <el-aside width="200px">
                <Sidebar />
            </el-aside>
            <el-main>
                <RouterView />
            </el-main>
        </el-container>
    </div>
</template>

<style scoped lang="less">
.common-layout {
    height: 100%;
    
    .el-container {
        height: 100%;

        .el-main{
            padding: 8px;
        }
        .el-aside{
            margin: 8px 0 8px 8px;
            border-bottom: 1px solid var(--el-menu-border-color);
            border-top: 1px solid var(--el-menu-border-color);
            border-left: 1px solid var(--el-menu-border-color);
        }
    }
}
</style>